<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/salejihui/css/cssreset.css">
        
        <link rel="stylesheet" href="${pageContext.request.contextPath}/salejihui/css/style2.css">
		
        <style>
        .main label.error{
       font-size:13px; 
		margin-left:8px;
		color: orangered;
        }
        iframe{
        width: 280px;
        }
        .tline .cdate2{
        	
        }
        </style>
    </head>
    <body>
    	<div class="bigbox2 changebox">
    		<nav class="nnav">
    			<span class="scolor"></span>
    			<ul>
    				<li><a href="../page/originalIndex.jsp"><p class="mline"><span class="smallicon"></span><span class="navtxt">首 页</span></p></a></li>
    				<li><a href="../client/findByIndex.action"><p class="mline"><span class="smallicon one1" ></span><span class="navtxt" >客 户</span></p></a></li>
    				<li><a href="../sale/findSale.action" id="sline"><p class="mline"><span class="smallicon one2" id="current21"></span><span class="navtxt" id="current2">销 售 机 会</span></p></a></li>
    				<li><a href="../contact/page.action"><p class="mline"><span class="smallicon one3" ></span><span class="navtxt">联 系 人</span></p></a></li>
    				<li><a href="../contract/findByAlls.action"><p class="mline"><span class="smallicon one4"></span><span class="navtxt">合 同</span></p></a></li>
    				<li class="shenpi"><a href="../page/pacts.jsp"><p class="mline"><span class="smallicon one8"></span><span class="navtxt">合 同 审 批</span></p></a></li>
    				<c:if test="${sessionScope.backstage == 1}">
   						<li><a href="../staff/selectTree.action"><p class="mline"><span class="smallicon one5"></span><span class="navtxt">后 台 管 理</span></p></a></li>
    				</c:if>
    			</ul>
    		</nav>
    		<div class="showbox2">
	    		<p class="title">销 售 机 会</p>
	    		<div class="aaa aaa2">
	    			<div class="smalltitle smalltitle2">
			 		<span class="back" id="hetong"><&nbsp;&nbsp;&nbsp;&nbsp;负责的联系人</span>
					 <p class="yezi">
						<a href="#" id="light3"><span class="imgmove"><img src="${pageContext.request.contextPath}/salejihui/images/icon (14).png" alt=""></span>&nbsp;&nbsp;导出</a>
						 <a href="#" id="biu"><span class="imgmove imgmove2"><img src="${pageContext.request.contextPath}/salejihui/images/icon (23).png" alt=""></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;新建销售机会</a>
					 </p>
					 <span class="yezi1">
					 	<a href="#" id="smallig" style="right:20px"><img src="${pageContext.request.contextPath}/salejihui/images/icon (20).png" alt=""></a>
					 <h4 class="checkok">已选择 <span style="color:#1fd4fb;" id="number"> </span>项</h4>
					 <span class="del" onclick="del()"><img src="${pageContext.request.contextPath}/salejihui/images/icon (17).png" alt="" style="position: absolute;bottom: 18px;left: -22px;cursor: pointer;">&nbsp;删除</span>
					  <span class="del shift"><img src="${pageContext.request.contextPath}/salejihui/images/icon (25).png" alt="" style="position: absolute;bottom: 19px;left: -29px;cursor: pointer;">&nbsp;转移</span>
			    	 <span class="close2" style="bottom: 15px;">
			    	 	<img src="${pageContext.request.contextPath}/salejihui/images/icon (18).png" alt="">
			    	 </span>
					 </span>
					 
	    			</div>
	    			<span class="blueline"></span>
	    			<div class="tab">
	    		<p class="tline cor cor2">
	    						<span id="select" class="xuanze" ">
	    							<input type="checkbox" style="margin-top: 15px;" class="check1" id="selectCheck" value="1" onclick="selectCheck()">
	    						</span>
			    		            <span class="cname">机会名称</span>
			    		            <span class="cdate2">销售机会所有人</span>
			    		            <span class="cname">客户名称</span>
			    		            <span class="cdate2">机会类型</span>
			    		            <span class="cduty">销售金额</span>
			    		            <span class="cdate">接单日期</span>
			    		            <span class="cdate2">销售阶段</span>
			    		            <span class="cduty">机会来源</span>
			    		            <span class="cdate">创建日期</span>
			    		           
	    		</p>
	    		<c:forEach items="${list}" var="salels" varStatus="status">
			    		    	<p class="tline tline2 cor cor3" name="selectall">
			    		            <span class="xuanze"><input style="margin-top:15px;" type="checkbox" id="${status.index+1}" value="${salels.sale.saleId}" name="items" onclick="checkedShow()"></span>
			    		            
			    		            <span class="cname"><a style="color: #616264;;font-size: 14px; text-decoration: none; " href="${pageContext.request.contextPath}/sale/findSaleId.action?id=${salels.sale.saleId}&pageSize=10&pageNum=1">${salels.sale.saleOpportunityName}</a></span>
			    		            <span class="cdate2">${salels.staff}</span>
			    		            <span class="cname">${salels.client}</span>
			    		            <span class="cdate2">${salels.sale.saleOpportunitytype}</span>
			    		            <span class="cduty">${salels.sale.saleMoney}</span>
			    		            <span class="cdate"><fmt:formatDate value="${salels.sale.saleCloseDate}" type="both" pattern="yy-MM-dd"/></span>
			    		            <span class="cdate2">${salels.salestage}</span>
			    		            <span class="cduty">${salels.sources}</span>
			    		            <span class="cdate"><fmt:formatDate value="${salels.sale.createDate}" type="both" pattern="yy-MM-dd hh-mm-ss"/></span>
			    		            
			    		    	</p>
			    		    	</c:forEach>
	    		
			    		          
		
		
	    			</div>
	    			<div id="cover">
				<div id="cover-bg"></div>
				<div id="cover-content">
						<form action="${pageContext.request.contextPath}/sale/insertSale.action" method="post" id="insertform">
									<h4>新 建 销 售 机 会<span class="close"></span></h4>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">机会所有人</span>
										
										<span class="xsicon"><img src="${pageContext.request.contextPath}/salejihui/images/head.png" alt="" class="kkk" style="top:0px">&nbsp;</span>
										<span class="name" style="bottom:12px">${staff.staff_name}</span><!---->
										
									
										<input type="hidden" class="name" id="staffId" name="staffId" value="${staff.staff_id}">
										
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">机 会 名 称</span>
										<input type="text" placeholder="&nbsp;&nbsp;请输入机会名称 " class="shurukuang" name="saleOpportunityName">
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">客 户 名 称</span>
										
										<select id="one" class="shenfenselect shenfenselect3" name="clientId" >
										<c:forEach var="client" items="${client}">
								            <option value="${client.client_id}">${client.client_name}</option>
								          </c:forEach>
								        </select>
								        
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">销 售 金 额</span>
										<input type="text" placeholder="&nbsp;&nbsp;请输入销售金额 " class="shurukuang" name="saleMoney">
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">销 售 阶 段</span>
										<select id="one" class="shenfenselect shenfenselect3" name="salestageId" >
								            <c:forEach var="salestages" items="${salestages}">
								            <option value="${salestages.saleStageId}">${salestages.saleStageName}</option>
								          </c:forEach>
								          
								        </select>
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">结 单 日 期</span>
										
										<input type="text" class="shurukuang Wdate" style="height: 30px;1px solid #bfbfbf;" placeholder="&nbsp;&nbsp;请输入结单日期 "  name="saleCloseDate" onfocus="WdatePicker({skin:'whyGreen',dateFmt: 'yyyy-MM-dd', readOnly:true})">
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">备 注&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
										<input type="text" placeholder="&nbsp;&nbsp;请输入备注 " class="shurukuang" name="saleRemark">
									</p>
									<p class="main" style="padding-right:0px;">
										<span class="leftmain">所 属 部 门</span>
										<select id="one" class="shenfenselect shenfenselect3" name="departmentId">
								           <c:forEach var="departments" items="${departments}">
								            <option value="${departments.department_id}">${departments.department_name}</option>
								          </c:forEach>
								        </select>
									</p>
						
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">机 会 类 型</span>
										<select id="one" class="shenfenselect shenfenselect3" name="saleOpportunitytype">
								            <option value="新机会类型">新机会类型</option>
								            <option value="旧机会类型">旧机会类型</option>
								    
								            
								        </select>
									</p>
									<p class="main" style="padding-right: 0px">
										<span class="leftmain">机 会 来 源</span>
										<select id="one" class="shenfenselect shenfenselect3" name="sourceId">
								            <c:forEach var="sources" items="${sources}">
								            <option value="${sources.sourceId}">${sources.sourceName}</option>
								          </c:forEach>
								           
								        </select>
									</p>
									
									<p class="main" style="text-align: center;padding-left: 0px;padding-bottom:30px;">
										
										<button class="btn1 btn2" type="submit">保存</button>
										<button class="btn1 btn3" type="button" onclick="quxiao()">取消</button>
									</p>
								</form>	
				</div>
					</div>
					
					
					
	    		</div>

	    		<div class="two">
	    			<span class="sum">合计</span>
	    			<span class="money">销售金额(元):&nbsp;&nbsp;<span style="color:tomato;">${money}</span></span>
	    			
	    		</div>	    		
    		</div>
    	</div>
    </body>
    <script src="${pageContext.request.contextPath}/salejihui/js/jquery-1.8.3.min.js"></script>
		<script src="${pageContext.request.contextPath}/salejihui/My97DatePicker/WdatePicker.js"></script>
		<script src="${pageContext.request.contextPath}/salejihui/js/jquery.validate.min.js"></script>
		<script src="${pageContext.request.contextPath}/salejihui/js/messages_zh.min.js"></script>
     
     <script>
		  	function selectCheck(){
	    	   var judge = $("#selectCheck").val();
	    	   var objs = document.getElementsByName("items");
			   if(judge == 1){
				   for(var i = 0,l = objs.length;i < l;i++){
		    		   objs[i].checked = true;
		    	   }
				   $("#selectCheck").val(0);
	    	   }else{
	    		   for(var i = 0,l = objs.length;i < l;i++){
		    		   objs[i].checked = false;
		    	   }
	    		   $("#selectCheck").val(1);
	    	   }
	    	   
	    	   checkedShow();
	       }
		  	
		  	function checkedShow(){
		  		var str = "";
	    	    var number = 0;
	    	    var obj = document.getElementsByName("items");
				for(var i = 0,l = obj.length;i < l;i++){
					if(obj[i].checked){
						str += obj[i].value+",";
						number++;
					}
				}    	   
	    			
	    	    if(str == ""){
	    		   $(".yezi1").hide();
	    		   $('.smalltitle2 p').css('display', 'block');
	    		   $('.back').css('display', 'block');
	    		   
	    	    }else{
	    	       $('.smalltitle2 p').css('display', 'none');
	    		   $(".staff_id").html(str);
	    		   $(".yezi1").show();
	    		   $("#number").html(number);
	    		   $('.back').css('display', 'none');
	    		  
	    	   }
		  	}
		  	 
		  </script>
     <script>
     		
     		function quxiao(){
			$("#cover").removeAttr("style");
			        $("#cover-content").removeAttr("style");
			         $("#cover1").removeAttr("style");
			        $("#cover-content1").removeAttr("style");
			        $('body').css("overflow","scroll");
		}
     		/* 
		 	//全选
		 	$("#select").find("input").click(function(){
		 	
			$("p[name='selectall']").each(function(){
				var check=$("#select").find("input").attr("checked");
				if(check){
					$(this).find("input[name='checkbox1']").prop("checked", true);
				}else{
					$(this).find("input[name='checkbox1']").prop("checked", false);
				}
				
				$("input[name='checkbox1']").each(function(){
				num1=$("input[name='checkbox1']:checked").length;
					
					$("#xuanxiang").text(num1);
				
					
				}); 
			})
		});
		
		$("input[name='checkbox1']").click(function(){
		num2=$("input[name='checkbox1']:checked").length;
					$("#xuanxiang").text(num2);		
		})
		   */
		  function del(){
		 	
		 var delid="";
		var num=0;
		$("input[name='checkbox1']").each(function(){
			if($(this).attr("checked")){
				num++;
				delid+=$(this).val()+",";
				
			}
		});		
		var url="${pageContext.request.contextPath}/sale/deleteManyId.action";
					var pam={
							delid:delid,
							id:$("#staffId").val()
							};
					
					$.post(url,pam,function(data){		
							location="${pageContext.request.contextPath}/sale/findSale.action";
				}); 
			    }
		 
		       $(function(){
		         /* jQuery.validator.addMethod("stringCheck", function(value, element) {
				  var length = value.length;  
    var regName = /[^\u4e00-\u9fa5]/g;  
    return this.optional(element) || !regName.test( value ); 
				}, "机会名称为中文");  */
		         var validate = $("#insertform").validate({
                debug: true, //调试模式取消submit的默认提交功能   
                //errorClass: "label.error", //默认为错误的样式类为：error   
                focusInvalid: false, //当为false时，验证无效时，没有焦点响应  
                onkeyup: false,   
                submitHandler: function(form){   //表单提交句柄,为一回调函数，带一个参数：form   
                       
                    form.submit();   //提交表单   
                },   
                
                 
                
                rules:{
                    saleOpportunityName:{
                        required:true
                    },
                    clientId:{
                        required:true
                    },
                    saleMoney:{
                        required:true,
                        number:true
                        
                    },
                     salestageId:{
                        required:true
                    },
                    saleCloseDate:{
                        required:true
                    },
                   
                     departmentId:{
                        required:true
                    },
                    saleOpportunitytype:{
                        required:true
                        
                    },
                    sourceId:{
                        required:true
                        
                    }                   
                },
                messages:{
                    saleOpportunityName:{
                        required:"机会名不能为空"
                    },
                    clientId:{
                        required:"客户不能为空"
                        
                    },
                    saleMoney:{
                        required: "请输入金额",
                         number:"请输入正确的金额"
                    },
                    salestageId:{
                        required:"必填"
                    }, 
                     saleCloseDate:{
                        required:"请输入时间"
                    },
                   
                     departmentId:{
                        required:"必填"
                    },
                     saleOpportunitytype:{
                        required:"必填"
                    },
                     sourceId:{
                        required:"必填"
                    },
                }
                          
            });    

			    $(".smalltitle #biu").click(function(e){
			        e.preventDefault();
			        $("body").css('overflow','hidden');
			        $("#cover").css("display","block");
			        $("#cover").animate({
			            width: "100%",
			            height: "1800px",
			            top: "0",
			            left: "0"
			        },10);
			    });
			    $(".close").click(function(){
			    $("body").css('overflow','scroll');
			        $("#cover").removeAttr("style");
			        $("#cover-content").removeAttr("style");
			        
			    });
			  
			    $('.check1').click(function(event) {
			    	//$('.back').css('display', 'block');
			    	$('#smallig').css('display', 'none');  
			    	/* $('.smalltitle2 p').css('display', 'none'); */
			    	$('.checkok').css('display', 'block');
			    	$('.del').css('display', 'block');
			    	$('.shift').css('display', 'block');
			    	$('.close2').css('display', 'block');
			    });
			    $('.close2').click(function(event) {
			    	$('.back').css('display', 'block');
			    	$('#smallig').css('display', 'block');
			    	$('.smalltitle2 p').css('display', 'block');
			    	$('.checkok').css('display', 'none');
			    	$('.del').css('display', 'none');
			    	$('.shift').css('display', 'none');
			    	$('.close2').css('display', 'none');
			    }); 
			});
		  </script> 
		  
    
</html>
